<template>
    <a-modal v-if="visible" class="fillmaskModal" title="新建任务内容" :width="1500" :visible="visible"
        :confirmLoading="confirmLoading" :loading="isLoaging" @ok="handleOk" @cancel="handleCancel" cancelText="取消"
        wrapClassName="ant-modal-cust-warp" style="top:5%;height: 90%;overflow-y: hidden">
        <div>
            <a-steps v-model="currentTab" type="navigation" size="small" :style="stepStyle">
                <a-step status="d1" title="新建任务" :disabled="true" />
                <a-step status="d2" title="部门架构" :disabled="true" v-show="currentTab == 1" />
                <a-step status="d3" title="企业指标" :disabled="true" />
            </a-steps>
            <!-- <a-steps v-model="currentTab" type="navigation" size="small" :style="stepStyle">
      <a-step status="finish" title="finish 1" />
      <a-step status="finish" title="finish 2" />
      <a-step status="process" title="current process" />
      
    </a-steps> -->
        </div>
        <div>
            <!-- 新建任务 -->
            <!-- <NewTask v-show="currentTab == 0" @nextStep="nextStep"></NewTask> -->
            <!-- 部门架构 -->
            <!-- <DepartmentStructure v-show="currentTab == 1"></DepartmentStructure> -->
            <!-- 企业指标 -->
            <!-- <EnterpriseIndexSet v-show="currentTab == 2"></EnterpriseIndexSet> -->

            <!-- 新建任务 -->
            <NewTask v-if="currentTab == 0" @nextStep="nextStep" @formInfo="formInfo"></NewTask>
            <!-- 部门架构 -->
            <DepartmentStructure v-else-if="currentTab == 1"></DepartmentStructure>
            <!-- 企业指标 -->
            <EnterpriseIndexSet v-else></EnterpriseIndexSet>
        </div>
    </a-modal>
</template>


<script>
import NewTask from './NewTask'
import DepartmentStructure from './DepartmentStructure'
import EnterpriseIndexSet from './EnterpriseIndexSet'

export default {
    data() {
        return {
            form: null,  // 手机表单中的数据
            visible: false,
            confirmLoading: false,
            currentTab: 0,
            stepStyle: {
                marginBottom: '60px',
                boxShadow: '0px -1px 0 0 #e8e8e8 inset',
            },
            isLoaging: false,
            paramsInfo: {},
            initial: 0,


        }
    },
    created() {
        this.form = this.$form.createForm(this)

    },
    components: {
        NewTask,
        DepartmentStructure,
        EnterpriseIndexSet
    },
    mounted() {

        // 接收传递的页数
        this.$bus.$on('pages', (params) => {
            this.currentTab = params
        })

        // this.$emit('parInfo', this.paramsInfo)
        // 接收子组件参数点击确定
        this.$bus.$on('formInfo', (params) => {
            this.paramsInfo = params
            // console.log(params, 'params接收下一步的参数点击确定')
            // console.log(this.paramsInfo, 'this.paramsInfo接收下一步的参数点击确定')
            // console.log(params.taskName, 'params接收下一步的参数点击确定')
            // console.log(params.scope3, 'params接收下一步的参数点击确定')
            // console.log(params.scope4, 'params接收下一步的参数点击确定')
        })
        console.log(this.paramsInfo, '自定义接收参数')
    },
    methods: {

        // 父组件调用方法
        add() {
            this.visible = true

        },

        // 自定义接收参数
        formInfo(val) {
            this.paramsInfo = val
            console.log(this.paramsInfo, 'this.paramsInfothis.paramsInfothis.paramsInfothis.paramsInfo')
        },

        // 点击确定
        handleOk() {
            this.visible = false;
            console.log(this.paramsInfo, '////////')
            this.$bus.$emit('paramsInfo', this.paramsInfo)
            // alert(111)
        },

        // 点击取消
        handleCancel() {
            this.visible = false;
        },

        nextStep(value) {
            this.currentTab = 1
            console.log(value, 6666)
        },

    }
}
</script>

<style lang="scss" >
.ant-steps-item-icon {
    visibility: hidden !important;
}
</style>